import { observer } from "mobx-react";
import { toJS } from 'mobx';
import { Row, Col, Radio } from 'antd';
import { isArray, isObject, isEmpty, endsWith, isEqual } from 'lodash';
import { WeaSearchGroup, WeaFormItem, WeaInput, WeaSelect, WeaBrowser, WeaCheckbox, WeaLocaleProvider, WeaInputNumber, WeaHelpfulTip, WeaDatePicker, WeaTimePicker } from 'ecCom';
import { TaskViewPageType } from "../../../constants/task";
import DynamicNodeInfo from "./DynamicNodeInfo"
const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class NodeForm extends React.Component {
    render() {
        const { store } = this.props;
        const { nodeForm } = store;
        return nodeForm.isInit ? (
            <div className="edc-node-form">
                <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@oxfc8e`}
                    title={getLabel('502654', '基本信息')}
                    showGroup={true}
                >
                    {this.getBaseInfo()}
                </WeaSearchGroup>
                <div className="toggle" onClick={store.hideNodeForm}></div>
            </div>
        ) : (
                <div style={{ fontSize: 16, paddingTop: 100, textAlign: 'center', color: '#ccc' }} >
                    {getLabel('502655', '未选择节点')}
                </div>
            )
    }
    getBaseInfo = () => {
        const { store } = this.props;
        const { nodeForm } = store;
        return [this.getNameInfo(),
        this.getHrefLinkInfo(),
        nodeForm.isExcelPage && this.getSheetInfo(),
        !nodeForm.isExcelPage && nodeForm.isLoadPage && this.getLoadInfo(),
        nodeForm.resourceInfoVisible && (store.pathType < 3 ? this.getResourceInfo() : store.pathType == 3 ? <DynamicNodeInfo ecId={`${this && this.props && this.props.ecId || ''}_DynamicNodeInfo@qvyked@`} store={store} /> : undefined),
        this.getReportTime(),
        nodeForm.isExcelPage && this.getAutoSaveType(),
        nodeForm.isExcelPage && nodeForm.saveTimeTypeVisible && this.getAutoSaveTime(),
        this.getReportType(),
        this.getUndoType(),
        this.getOperateMenu(),
        nodeForm.isExcelPage && this.getFieldPropMenu(),
        this.getBeforeNodeOperateMenu(),
        this.getSynchronizeType(),
        //this.getJoinCubeSet(),
        nodeForm.parentid == 0 && this.getCountProcess()
        ]
    }
    getUndoType = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const { label, labelCol, fieldCol, value = '0', onChange } = nodeForm.bind('undoType');
        const change = (e) => {
            onChange(e.target.value);
        }
        return (
            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@3tj7il`}
                label={getLabel('502900', '撤回方式')}
                labelCol={{ span: `${labelCol}` }}
                wrapperCol={{ span: `${fieldCol}` }}>
                <div className="cusRadio">
                    <Radio.Group ecId={`${this && this.props && this.props.ecId || ''}_undefined@66bjdp`} onChange={change} value={value} disabled={readonly}>
                        <Radio.Button ecId={`${this && this.props && this.props.ecId || ''}_undefined@gaiqyd`} value="0">{getLabel('502656', '禁止')}</Radio.Button>
                        <Radio.Button ecId={`${this && this.props && this.props.ecId || ''}_undefined@sg3gn8`} value="2">{getLabel('506821', '提交前')}</Radio.Button>
                        <Radio.Button ecId={`${this && this.props && this.props.ecId || ''}_undefined@b15gx1`} value="1">{getLabel('506822', '查看前')}</Radio.Button>
                    </Radio.Group>
                </div>
            </WeaFormItem>
        )
    }
    getReportType = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const { label, labelCol, fieldCol, value = '1', onChange } = nodeForm.bind('reportType');
        return (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@ahud9c`}
            label={`${getLabel('502899', '联合上报')}`}
            labelCol={{ span: `${labelCol}` }}
            wrapperCol={{ span: `${fieldCol}` }}>
            <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@svprjo`}
                helpfulTip={getLabel('527145', '开关开启表示联合上报，即有多个下级节点时，必须所有下级提交任务后，当前节点才能填报；开关关闭时表示非联合上报，即有多个下级节点时，只要其中一个节点提交了数据，当前节点就可以进行填报。')}
                value={value}
                display="switch"
                onChange={onChange}
                viewAttr={readonly ? 1 : 2}
                />
        </WeaFormItem>)
    }

    getAutoSaveType = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const { label, labelCol, fieldCol, value = '0', onChange } = nodeForm.bind('autoSaveType');
        return (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@dlzydo`}
            label={`${getLabel('512007', '自动保存')}`}
            labelCol={{ span: `${labelCol}` }}
            wrapperCol={{ span: `${fieldCol}` }}>
            <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@5qj511`}
                value={value}
                display="switch"
                onChange={onChange}
                viewAttr={readonly ? 1 : 2}
            />
        </WeaFormItem>)
    }

    getAutoSaveTime = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const { label, labelCol, fieldCol, value = '1', onChange } = nodeForm.bind('saveTime');
        return (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@chss75`}
            label={`${getLabel('512008', '自动保存间隔')}`}
            labelCol={{ span: `${labelCol}` }}
            wrapperCol={{ span: `${fieldCol}` }}>
            <WeaInputNumber ecId={`${this && this.props && this.props.ecId || ''}_WeaInputNumber@h2wjsv`} value={Math.max(1, value)} onChange={onChange} min={1} style={{ width: 60, marginRight: 10 }} viewAttr={readonly ? 1 : 2}></WeaInputNumber>
            <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@sbxsiz`}
                //style={{ width: 50, display: 'inline-block' }}
                className="saveTime"
                options={[{ key: "0", showname: getLabel('508527', '分') }, { key: "1", showname: getLabel('513512', '时') }]}
                value={nodeForm.saveTimeType || '0'}
                onChange={nodeForm.change.bind(nodeForm, 'saveTimeType')}
                viewAttr={readonly ? 1 : 2}
            />
        </WeaFormItem>)
    }

    getReportTime = () => {
        const { store } = this.props;
        const { nodeForm,readonly } = store;
        const { label, labelCol, fieldCol, value, onChange } = nodeForm.bind('reportTime');
        const { value:settingValue, onChange:changeSetting } = nodeForm.bind('reportTimeSetting');
        const { type='default',timeType,dayNum,week,time} = settingValue;
        const changeType = (value) => {
            if(value!==type) changeSetting({...settingValue,type:value});
        }
        const changeTimeType = (value) => {
            if(value!==timeType) changeSetting({...settingValue,timeType:value});
        }
        const changeDayNum = (value) => {
            if(value!==dayNum) changeSetting({...settingValue,dayNum:value});
        }
        const changeWeek = (value) => {
            if(value!==week) changeSetting({...settingValue,week:value});
        }
        const changeTime = (value) => {
            if(value!==time) changeSetting({...settingValue,time:value});
        }
        return (
        <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@6j5n3o`}
            label={`${getLabel('502898', '填报时间')}`}
            labelCol={{ span: `${labelCol}` }}
            wrapperCol={{ span: `${fieldCol}` }}>
            <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@xssx3g`}
                className="reporttime"
                options={[{ key: 'default', showname:  getLabel('521044','常规') }, { key: 'setting', showname: getLabel('527430','固定时间') }]} 
                detailtype={3}
                value={type}
                onChange = {changeType}
            />
            <div style={{display:'flex'}}>
                {type === 'default' && <WeaInputNumber ecId={`${this && this.props && this.props.ecId || ''}_WeaInputNumber@4qm0pm`} value={value} onChange={onChange} min={1} style={{ width: 60, marginRight: 10 }} disabled={readonly}></WeaInputNumber>}
                {type === 'default' && 
                    <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@mjjukp`}
                        className="reporttime"
                        disabled={readonly}
                        options={[{ key: "0", showname: getLabel('513512', '时') }, { key: "1", showname: getLabel('502660', '天') }, { key: "2", showname: getLabel('502661', '月') }]}
                        value={nodeForm.reportTimeType}
                        onChange={nodeForm.change.bind(nodeForm, 'reportTimeType')}/> }

                {type === 'setting' &&
                    <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@sb2ezn`}
                        className="reporttime"
                        disabled={readonly}
                        options={[{ key: "year", showname: getLabel('528130','每年')  },{ key: "month", showname: getLabel('528131','每月')  },{ key: "week", showname: getLabel('528132','每周')  },{ key: "day", showname: getLabel('528133','每天')  }]}
                        value={timeType}
                        onChange={changeTimeType}
                    />}
               {type === 'setting' && (timeType === 'year' || timeType === 'month' ) && 
                    <div style={{display:'flex',marginLeft:10}}>
                        <div style={{marginTop:5}}>{getLabel('528134','第') }</div>
                                <WeaInputNumber ecId={`${this && this.props && this.props.ecId || ''}_WeaInputNumber@8ta6ef`} style={{width:60}} value={dayNum} onChange={changeDayNum} min={1} max={timeType === 'year'?366:31} disabled={readonly}/>
                        <div style={{marginTop:5}}>{getLabel('502660', '天') }</div>
                    </div>
               }
               {type === 'setting' && timeType === 'week' && <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@l1o2a3`} style={{marginLeft:10,width:100}} value={week} onChange={changeWeek} disabled={readonly} options={[{key:'0',showname:getLabel('528251','周一') },{key:'1',showname:getLabel('528252','周二') },{key:'2',showname:getLabel('528253','周三') },{key:'3',showname:getLabel('528254','周四') },{key:'4',showname:getLabel('528255','周五') },{key:'5',showname:getLabel('528256','周六') },{key:'6',showname:getLabel('528257','周日') },]}/>}
               {type==='setting' && <WeaTimePicker ecId={`${this && this.props && this.props.ecId || ''}_WeaTimePicker@28ncj1`} style={{marginLeft:10,width:timeType==='day'?190:undefined}} value={time} onChange={changeTime} disabled={readonly}/>}
            </div>
            
        </WeaFormItem>)
    }
    getNameInfo = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const { label, labelCol, fieldCol, value, onChange } = nodeForm.bind('name');
        return (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@cy2e2z`}
            label={`${getLabel('502717', '节点名称')}`}
            labelCol={{ span: `${labelCol}` }}
            wrapperCol={{ span: `${fieldCol}` }}>
            <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@uicirr`} value={value} onChange={onChange} viewAttr={readonly ? 1 : 3}></WeaInput>
        </WeaFormItem>)
    }
    getResourceInfo = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const { label, labelCol, fieldCol, valueObj, onChange } = nodeForm.bind('resourceid', 'resourceObj');
        return (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@ms0v6f`}
            label={`${getLabel('502894', '操作者')}`}
            labelCol={{ span: `${labelCol}` }}
            wrapperCol={{ span: `${fieldCol}` }}>
            <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@5gnsqq`}
                type={17}
                isSingle={false}
                replaceDatas={toJS(valueObj)}
                onChange={onChange}
                viewAttr={readonly ? 1 : 3}
                icon="icon-coms02-Data-center"
                iconBgcolor="#1a57a0"
                title={getLabel('502662', '选择操作者')}
            />
        </WeaFormItem>)
    }
    getHrefLinkInfo = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const bindObj = nodeForm.bind('hreflinkObj');
        const { label, labelCol, fieldCol, onChange, options, options1 } = bindObj;
        let { value } = bindObj;
        if (!value || !isArray(toJS(value))) {
            value = [TaskViewPageType.CUSTOM, '', ''];
        }
        const [pageType, pageUrl, pageId, load] = value || [];
        const sheetIdsbindObj = nodeForm.bind('sheetIds');
        const { onChange: sheetIdsOnChange } = sheetIdsbindObj;
        if (readonly) {
            const [{ showname: typeName } = { typeName: getLabel(502465, '自定义') }] = options.filter(d => d.key === pageType);
            const readvalue = `${typeName}：${pageType === TaskViewPageType.CUSTOM ? pageUrl : pageType === TaskViewPageType.EXCEL ?
                (options1.filter(d => d.key === pageId)[0] || {}).showname
                : ""}`;
            return (
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@gcg847`}
                    label={`${label}`}
                    labelCol={{ span: `${labelCol}` }}
                    wrapperCol={{ span: `${fieldCol}` }}>
                    <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@kv67d7`} value={readvalue} viewAttr={1} />
                </WeaFormItem>
            )
        }
        const changePageType = (value) => {
            sheetIdsOnChange('0');//切换EXCEL类型时初始化sheet页多选框
            onChange([value, pageUrl, pageId, load]);
        }
        const changePageId = (value) => {
            sheetIdsOnChange('0');//切换page时初始化sheet页多选框
            onChange([pageType, pageUrl, value, load]);
        }
        const changePageUrl = (value) => {
            onChange([pageType, value, pageId, load]);
        }

        const hreflinkObjOptions = [{
            key: TaskViewPageType.EXCEL,
            showname: getLabel('502895', '表格'),
            selected: true
        }, {
            key: TaskViewPageType.CUSTOM,
            showname: getLabel('502465', '自定义')
        }, {
            key: TaskViewPageType.LOAD,
            showname: getLabel('514903', '路由地址')
        }
        ];

        return (
            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@dauqwk`}
                label={`${label}`}
                labelCol={{ span: `${labelCol}` }}
                wrapperCol={{ span: `${fieldCol}` }}>
                <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@s7qiix`} gutter={10}>
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@hfntaf`} span={9}>
                        <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@tjdm5b`}
                            options={hreflinkObjOptions}
                            value={pageType}
                            onChange={changePageType}
                            viewAttr={readonly ? 1 : 3}
                        />
                    </Col>
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@wx416g`} span={15}>
                        {pageType === TaskViewPageType.EXCEL && <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@6qw890`} options={options1} value={pageId} onChange={changePageId} ></WeaSelect>}
                        {pageType === TaskViewPageType.CUSTOM &&
                            <div style={{ display: 'flex' }}>
                                <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@9yil1r`} title={pageUrl} value={pageUrl} onChange={changePageUrl} ></WeaInput>
                                <WeaHelpfulTip ecId={`${this && this.props && this.props.ecId || ''}_WeaHelpfulTip@wbj9i7`} style={{ padding: '5px 0px 0px 5px' }}
                                    title={
                                        <div>
                                            <p>{getLabel('514913','参数说明：')}</p>
                                            <p>{getLabel('514914','$userId$，当前用户id') }</p>
                                            <p>{getLabel('514939','$subCompanyId$，用户的分部id')}</p>
                                            <p>{getLabel('514940','$departmentId$，用户的部门id')}</p>
                                            <p>{getLabel('514941','$jobId$，用户的岗位id')}</p>
                                            <p>{getLabel('514942','$taskId$，填报任务id')}</p>
                                            <p>{getLabel('514943','$nodeId$，填报节点id')}</p>
                                            <p>{getLabel('514944','$modeId$，关联模块id')}</p>
                                        </div>
                                    }
                                    placement="left" />
                            </div>
                        }
                    </Col>
                </Row>

            </WeaFormItem>
        )
    }
    getSheetInfo = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const hreflinkObj = nodeForm.bind('hreflinkObj');
        const { value: hreflinkValue, options1 } = hreflinkObj;
        const [pageType, pageUrl, pageId, load] = hreflinkValue || [];
        const bindObj = nodeForm.bind('sheetIds');
        const { labelCol, fieldCol, onChange, value } = bindObj;
        const sheetOptions = (options1.filter(d => d.key === pageId)[0] || {}).sheetOptions || [];
        if (sheetOptions.length == 0) {
            onChange('');
        }
        let idArr = sheetOptions.map(o => o.key) || [];
        const changeSheets = (value) => {
            const changeValue = idArr.length > 0 ? isEqual(idArr.sort(), value.split(",").sort()) ? '0' : value : '';
            onChange(changeValue);
        }
        const sheetIds = idArr.join(",");
        return (
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@64xs8q`}
                    label={`${getLabel('515243', 'sheet页')}`}
                    labelCol={{ span: `${labelCol}` }}
                    wrapperCol={{ span: `${fieldCol}` }}
                >
                    <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@rvj1dw`} multiple={true} options={sheetOptions} viewAttr={readonly ? 1 : 3} value={value === '0' ? sheetIds : value} onChange={changeSheets}></WeaSelect>
                </WeaFormItem>
        )
    }

    getLoadInfo = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const bindObj = nodeForm.bind('hreflinkObj');
        const { labelCol, fieldCol, onChange } = bindObj;

        const { value } = bindObj;
        let [pageType, pageUrl, pageId, params] = value || [];
        if (!params || !isObject(toJS(params))) {
            params = {
                module: '',
                route:'',
                staticResource:''
            }
        }
        const { module, route, staticResource } = params || {};

        const changeParams = (key, value) => {
            params[key] = value;
            onChange([pageType, pageUrl, pageId, params]);
        }

        return (
            <div>
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@5l9pwo`}
                    label={`${getLabel('514907', '前端模块名')}`}
                    labelCol={{ span: `${labelCol}` }}
                    wrapperCol={{ span: `${fieldCol}` }}
                    >
                    <div style={{ display: 'flex' }}>
                        <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@xk6jqk`}  viewAttr={readonly ? 1 : 2} value={module} onChange={changeParams.bind(this, 'module')}></WeaInput>
                        <WeaHelpfulTip ecId={`${this && this.props && this.props.ecId || ''}_WeaHelpfulTip@ueh7tk`} style={{ padding: '5px 0px 0px 5px' }}
                            title={
                                <div>
                                    <p>{getLabel('514909','前端打包的模块名')}</p>
                                    <p>{getLabel('514910','如：') + 'weaEdcApp'}</p>
                                </div>
                            }
                            placement="left" />
                    </div>
                </WeaFormItem>
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@dwu7s9`}
                    label={`${getLabel('514903', '路由地址')}`}
                    labelCol={{ span: `${labelCol}` }}
                    wrapperCol={{ span: `${fieldCol}` }}>
                    <div style={{ display: 'flex' }}>
                        <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@bmfeol`} viewAttr={readonly ? 1 : 2} value={route} onChange={changeParams.bind(this, 'route')}></WeaInput>
                        <WeaHelpfulTip ecId={`${this && this.props && this.props.ecId || ''}_WeaHelpfulTip@dkquwe`} style={{ padding: '5px 0px 0px 5px' }}
                            title={
                                <div>
                                    <p>{getLabel('514911','页面路由地址')}</p>
                                    <p>{getLabel('514910','如：') + '/edc/view'}</p>
                                </div>
                            }
                            placement="left" />
                    </div>
                </WeaFormItem>
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@y0amcu`}
                    label={`${getLabel('514906', '静态资源')}`}
                    labelCol={{ span: `${labelCol}` }}
                    wrapperCol={{ span: `${fieldCol}` }}>
                    <div style={{ display: 'flex' }}>
                        <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@utyjpw`} viewAttr={readonly ? 1 : 2} value={staticResource} onChange={changeParams.bind(this, 'staticResource')}></WeaInput>
                        <WeaHelpfulTip ecId={`${this && this.props && this.props.ecId || ''}_WeaHelpfulTip@4vtzkm`} style={{ padding: '5px 0px 0px 5px' }}
                            title={
                                <div>
                                    <p>{getLabel('514912','引入js和css的路径')}</p>
                                    <p>{getLabel('514910','如：')  + '/spa/edc/static/index.js,/spa/edc/static/index.css'}</p>
                                </div>
                            }
                            placement="left" />
                    </div>
                </WeaFormItem>
            </div>
        )

    }

    getSynchronizeType = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const { label, labelCol, fieldCol } = nodeForm.bind('synchronizeType');
        const { valueObj } = nodeForm.bind('synchronizeNodeId', 'synchronizeNodeObj');
        const dataParams = { pathid: store.path.id, nodeid: nodeForm.id };
        return (<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@zckaqm`}
            label={`${getLabel('510990', '同步方式')}`}
            labelCol={{ span: `${labelCol}` }}
            wrapperCol={{ span: `${fieldCol}` }}>
            <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@ug9hn6`} gutter={10}>
                <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@2ftj7n`} span={12}>
                    <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@lk7wy1`}
                        options={[{ key: "0", showname: getLabel('508522', '不同步') }, { key: "1", showname: getLabel('508523', '同步到下级节点') }, { key: "2", showname: getLabel('508524', '同步到指定节点') }]}
                        value={nodeForm.synchronizeType || "0"}
                        onChange={nodeForm.change.bind(nodeForm, 'synchronizeType')}
                        viewAttr={readonly ? 1 : 3}
                    />
                </Col>
                <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@h6g3d5`} span={12}>
                    {nodeForm.synchronizeType === '2' &&
                        <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@zepkuq`}
                            icon={"icon-coms02-Data-center"}
                            title={getLabel('510980', '选择节点')}
                            type='edcAppPathNode'
                            isSingle={false}
                            dataParams={dataParams}
                            completeParams={dataParams}
                            destDataParams={dataParams}
                            maxBrowerHeight={100}
                            onChange={nodeForm.change.bind(nodeForm, 'synchronizeNodeId')}
                            replaceDatas={toJS(valueObj)}
                            viewAttr={readonly ? 1 : 3}
                        />
                    }
                </Col>
            </Row>
        </WeaFormItem>)
    }

    getOperateMenu = () => {
        return (
            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@gibvcu`}
                label={getLabel('513513', '操作菜单')}
                labelCol={{ span: '6' }}
                wrapperCol={{ span: '18' }}
            >
                <i className="icon-coms-Flow-setting edcNodeSet-icon edcNodeSet-operate" onClick={this.openOperateMenu} />
            </WeaFormItem>
        )
    }

    getFieldPropMenu = () => {
        return (
            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@0q35mv`}
                label={getLabel('508526', '字段属性')}
                labelCol={{ span: '6' }}
                wrapperCol={{ span: '18' }}
            >
                <i className="icon-coms-Flow-setting edcNodeSet-icon edcNodeSet-operate" onClick={this.openFieldPropMenu} />
            </WeaFormItem>
        )
    }
    getBeforeNodeOperateMenu = () => {
        return (
            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@vysjoc`}
                label={getLabel('513394', '节点前附加操作')}
                labelCol={{ span: '6' }}
                wrapperCol={{ span: '18' }}
            >
                <i className="icon-coms-Flow-setting edcNodeSet-icon edcNodeSet-operate" onClick={this.openBeforeNodeOperateMenu} />
            </WeaFormItem>
        )
    }
    getJoinCubeSet = () => {
        const { store } = this.props;
        const { nodeForm } = store;
        const className = nodeForm.joinCubeFlag ? "icon-coms-link edcJoinCubeSet edcNodeSet-icon edcNodeSet-operate" : "icon-coms-link edcNodeSet-icon edcNodeSet-operate";
        return (
            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@8vehnj`}
                label={getLabel('510979', '关联建模模块')}
                labelCol={{ span: '6' }}
                wrapperCol={{ span: '18' }}
            >
                <i className={className} onClick={this.openJoinCubeMenu} />
            </WeaFormItem>
        )
    }

    openOperateMenu = () => {
        const { store } = this.props;
        const { nodeForm } = store;
        store.operateMenuDialogStore.open({ nodeid: nodeForm.id })
    }

    openBeforeNodeOperateMenu = () => {
        const { store } = this.props;
        const { nodeForm } = store;
        store.beforeNodeOperateDialogStore.open({ nodeid: nodeForm.id, appid: store.params.appid })
    }

    openFieldPropMenu = () => {
        const { store } = this.props;
        const { nodeForm } = store;
        store.fieldPropDialogStore.open({ appid: store.params.appid, nodeid: nodeForm.id })
    }

    openJoinCubeMenu = () => {
        const { store } = this.props;
        const { nodeForm } = store;
        store.joinCubeDialogStore.open({ pathid: store.path.id, appid: store.params.appid, nodeid: nodeForm.id })
    }

    getCountProcess = () => {
        const { store } = this.props;
        const { nodeForm, readonly } = store;
        const { value = '0', onChange } = nodeForm.bind('countProcess');
        return (
            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@nd3a37`}
                label={getLabel('526462', '统计进度')}
                labelCol={{ span: '6' }}
                wrapperCol={{ span: '18' }}
            >
                <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@rrno3l`}
                    helpfulTip={getLabel('526463', '开启后,任务监控中的填报进度会将根节点的填报情况计算在内!')}
                    value={value}
                    display="switch"
                    onChange={onChange}
                    viewAttr={readonly ? 1 : 2}
                />
            </WeaFormItem>
        )
    }  
}